<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout"
    layout:decorator="blog/layout" th:with="title='Category:'+${category}+ ' |',active='categories'">
<header th:replace="blog/layout::headerFragment(${title},${active})"></header>

<body>
    <div layout:fragment="content">
        <div class="content-wrap">
            <div id="content" class="content">
                <div class="post-block category" style="opacity: 1; display: block;">
                    <div id="posts" class="posts-collapse">
                        <div class="collection-title" style="opacity: 1; display: block; transform: translateX(0px);">
                            <h1 style="margin:0 0 0 20px;">
                                <th:block th:text="${category}"></th:block><small
                                    style="margin-left: 5px;">Category</small>
                            </h1>
                        </div>
                        <th:block th:if="${articles}">
                            <article class="post post-type-normal" th:each="article : ${articles}">
                                <header class="post-header"
                                    style="opacity: 1; display: block; transform: translateY(0px);">
                                    <h2 class="post-title">
                                        <a class="post-title-link" th:href="@{'/detail/' + ${article.cid}}"
                                            itemprop="url">
                                            <span itemprop="name" th:text="${article.title}"></span>
                                        </a>
                                    </h2>
                                    <div class="post-meta">
                                        <time class="post-time" itemprop="dateCreated"
                                            th:text="${commons.fmtdate(article.created, 'MM-dd')}"></time>
                                    </div>
                                </header>
                            </article>
                        </th:block>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>

</html>